Port Lightbox to CSS and use it in runDialog

Make Lightbox stylable and add a common style. Use it in runDialog.
https://bugzilla.gnome.org/show_bug.cgi?id=604978

diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css
index 31c75ff3d487e7f4c31fe2a9f374deef3bd1c50c..e0386406d69b35f1e73ef185d2cdb32ff29b85d1 100644 (file)
--- a/data/theme/gnome-shell.css
+++ b/data/theme/gnome-shell.css
@@ -773,13 +773,13 @@ StTooltip {
     color: white;
 }
 
-.run-dialog-box {
-    background: rgba(0,0,0,0.3);
-}
-
 .run-dialog {
     padding: 8px;
     border: 1px solid rgba(128,128,128,0.40);
     border-radius: 4px;
     background: rgba(0,0,0,0.8);
 }
+
+.lightbox {
+    background-color: rgba(0, 0, 0, 0.27);
+}

diff --git a/js/ui/lightbox.js b/js/ui/lightbox.js
index 9434c7984215a6d31063ee423d6d8a118a408637..e2c1a98f0042f73164310f573ee1586e4170f8e6 100644 (file)
--- a/js/ui/lightbox.js
+++ b/js/ui/lightbox.js
@@ -2,12 +2,7 @@
 
 const Clutter = imports.gi.Clutter;
 const Lang = imports.lang;
-
-const Main = imports.ui.main;
-const Tweener = imports.ui.tweener;
-
-const SHADE_COLOR = new Clutter.Color();
-SHADE_COLOR.from_pixel(0x00000044);
+const St = imports.gi.St;
 
 /**
  * Lightbox:
@@ -38,11 +33,10 @@ Lightbox.prototype = {
     _init : function(container, inhibitEvents, width, height) {
         this._container = container;
         this._children = container.get_children();
-        this.actor = new Clutter.Rectangle({ color: SHADE_COLOR,
-                                             x: 0,
-                                             y: 0,
-                                             border_width: 0,
-                                             reactive: inhibitEvents });
+        this.actor = new St.Bin({ x: 0,
+                                  y: 0,
+                                  style_class: 'lightbox',
+                                  reactive: inhibitEvents });
 
         container.add_actor(this.actor);
         this.actor.raise_top();

diff --git a/js/ui/runDialog.js b/js/ui/runDialog.js
index e33a509b58d9b1554c5289a546628ef6496a6892..160542bc1be693ef4b1cf6f6e493c4ecc48a95f7 100644 (file)
--- a/js/ui/runDialog.js
+++ b/js/ui/runDialog.js
@@ -13,6 +13,7 @@ const St = imports.gi.St;
 const Gettext = imports.gettext.domain('gnome-shell');
 const _ = Gettext.gettext;
 
+const Lightbox = imports.ui.lightbox;
 const Main = imports.ui.main;
 
 const MAX_FILE_DELETED_BEFORE_INVALID = 10;
@@ -203,12 +204,13 @@ RunDialog.prototype = {
                                           x: 0, y: 0 });
         global.stage.add_actor(this._group);
 
-        this._box = new St.Bin({ style_class: 'run-dialog-box',
-                                 x_align: St.Align.MIDDLE,
-                                 y_align: St.Align.MIDDLE,
-                                 reactive: true });
+        let lightbox = new Lightbox.Lightbox(this._group, true);
+
+        this._box = new St.Bin({ x_align: St.Align.MIDDLE,
+                                 y_align: St.Align.MIDDLE });
 
         this._group.add_actor(this._box);
+        lightbox.highlight(this._box);
 
         let dialogBox = new St.BoxLayout({ style_class: 'run-dialog', vertical: true });